<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="https://res.wx.qq.com/t/wx_fed/weui-source/res/2.5.4/weui.min.css">
</head>

<body class="disflex jstctt-spcbt">
    <!-- 头部 -->
    <header class="header colorf disflex jstctt-spcbt">
        <i class="iconfont icon-shangyiyehoutuifanhui" id="backBtn"></i>
        <span class="info-title flex1 fon14">个人资料</span>
    </header>
    <!-- 内容 -->
    <main class="main flex1">
        <!-- 头像 -->
        <a class="portrait disflex jstctt-spcbt color8a">
            <span class="color10 flex1">个人头像</span>
            <img src="../img/getbadge02.jpg" alt="" class="portrait-img">
            <i class="iconfont icon-xiayiyeqianjinchakangengduo color4294f"></i>
        </a>
        
        <!-- 昵称 -->
        <label for="js_input2" class="weui-cell weui-cell_active">
            <div class="weui-cell__hd"><span class="weui-label">昵称</span></div>
            <div class="weui-cell__bd">
                <input id="js_input2" class="weui-input tright" placeholder="填写本人微信号的昵称" />
            </div>
        </label>
        <!-- 性别 -->
        <div id="showSexPicker" role="button" aria-haspopup="listbox"
            class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after">
            <div class="weui-cell__hd"><label class="weui-label">性别</label></div>
            <div class="weui-cell__bd">
                <div class="weui-select tright" id="sexSelect"></div>
            </div>
        </div>
        <!-- 日期 -->
        <div class="weui-cell weui-cell_active weui-cell_select" role="button" aria-haspopup="listbox"
            id="showBirthPicker">
            <div class="weui-cell__hd"><label class="weui-label">生日</label></div>
            <div class="weui-cell__bd"><div class="weui-select tright" id="birthSelect"></div></div>
        </div>
        <!-- 所在省 ·版本···················· -->
        <div id="showProvincePicker" role="button" aria-haspopup="listbox"
            class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after">
            <div class="weui-cell__hd"><label class="weui-label">所在城市</label></div>
            <div class="weui-cell__bd">
                <div class="weui-select tright" id="provinceSelect"></div>
            </div>
        </div>
        <!-- 所在市 ·版本···················· -->
        <div id="showCityPicker" role="button" aria-haspopup="listbox"
            class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after">
            <div class="weui-cell__hd"><label class="weui-label">所在城市</label></div>
            <div class="weui-cell__bd">
                <div class="weui-select tright" id="citySelect"></div>
            </div>
        </div>
        <!-- 文本域 -->
        <div class="weui-cells weui-cells_form">
            <div class="weui-cell weui-cell_active">
                <div class="weui-cell__bd">
                    <textarea class="weui-textarea" placeholder="请介绍一下自己吧" rows="3s"></textarea>
                    <div role="option" aria-live="polite" class="weui-textarea-counter"><span>0</span>/200</div>
                </div>
            </div>
        </div>
        
    </main>
    <!-- 底部保存按钮 -->
    <button class="save-btn colorf">保存信息</button>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
    <script src="https://res.wx.qq.com/open/libs/weuijs/1.2.1/weui.min.js" charset="utf-8"></script>
</body>

</html>